<!--
**********************************************************
* @Author: 张小平
* @Date:   2024-05-01
* @Email:  qqshuqian@163.com
* @Last modified: 最后修改日期
* @Description: 文件描述
**********************************************************
-->
<template>
  <div class="user">
    <basic-container>
      <avue-crud
              v-model="form"
              v-model:page="page"
              v-model:search="searchForm"
              :permission="getPermission"
              v-bind="bindVal"
              v-on="onEvent"
              :option="option"
              :data="tableData"
              :before-open="beforeOpen"

      >
        <template #menu="scope">
          <el-button link type="primary" size="small" icon="el-icon-plus" @click="handleEdit(scope.row)">编辑</el-button>

          <el-button link type="primary" size="small" icon="el-icon-plus" @click="handleShow(scope.row)">预览</el-button>
        </template>
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
  import curdMixin from '@/framework-core/mixins/crud';


  export default {
    name: "flow",
    mixins: [curdMixin],
    data() {
      return {
        pageConfig:{"url":"flow/proc","permissionConfig":"flow_proc"},
        searchForm: {},
        loading: false,
        form:{},
        option: {
          "border": true,
          "index": true,
          "indexLabel": "#",
          "stripe": true,
          "menuAlign": "center",
          "align": "center",
          "searchMenuSpan": 6,
          menuWidth: 600,
          editBtn:false,
          saveBtn: true,
          addBtn: false,
          rowKey: 'id',
          searchEnter:true,
          rowParentKey: 'parentId',
          "column": [
            {
              label: '流程KEY',
              prop: 'procKey',
              'search': true,
              type: "input",
              "span": 12,
              rules: [{
                required: true,
                message: '流程KEY',
                trigger: 'blur'
              }],
            },
            {
              label: '流程名称',
              prop: 'procName',
              'search': true,
              type: "input",
              "span": 12,
              rules: [{
                required: true,
                message: '流程名称',
                trigger: 'blur'
              }],
            },
            {
              label: '流程说明',
              prop: 'procName',
              type: "input",
              "span": 12
            },
            {
              label: '创建者',
              prop: 'createrName',
              type: "input",
              "span": 12
            },
            {
              label: '创建时间',
              prop: 'createTime',
              type: 'datetime',
              format: 'YYYY-MM-DD HH:mm',
              "span": 12
            }
            ]
        },

      };
    },
    computed: {
      ...mapState({
        permissions: (state) =>state.user.permission,
      })

    },
    created() {
      this.init();
    },
    methods: {
      init() {
      },
      handleEdit: function(row) {
        const routeData =  this.$router.resolve({
          path: "/oa/design",
          query: {
            flowId: row.id,
            formId: row.formId
          }
        })
        window.open(routeData.href, '_blank');
      },

      handleShow: function(row) {
        const routeData =  this.$router.resolve({
          path: "/form/preview",
          query: {
            formId: row.formId,
            dataId: '',
            flowKey:row.procKey
          }
        })
        window.open(routeData.href, '_blank');
      },
      getPermission: function (key, row, index) {
        return true;
        //return this.getCommPermission(key, row, index);
      },

    }
  };
</script>
<style lang="scss">

</style>
